<!-- head —— 更新日志 弹窗-->
<template>
  <el-card shadow="never">

    <div slot="header"
         class="clearfix">
      <div class="flex-between">
        <div class="flex-start-center">
          <div class="line"></div>
          <div class="fontSize16"
               style="font-weight: 700">更新日志 </div>
        </div>
        <div class="flex-start-center"
             v-if="is_platform">

          <el-button v-if="flag"
                     type="primary"
                     :loading="loadingUpdata"
                     @click="updata()">
            更新
          </el-button>
        </div>
      </div>
    </div>
    <el-scrollbar style="height: 546px;overflow-x: auto;"
                  wrapStyle="overflow-x: hidden;"
                  viewStyle="padding: 14px 10px;">
      <el-timeline :reverse="false"
                   class="ele-timeline ele-timeline-act">
        <el-timeline-item v-for="(item, index) in journal"
                          :key="index">
          <div class="leftStyle flex-column">
            <div class="title m-bottom10">{{ item.date }}</div>
            <!-- <div class="title">20:46</div> -->
          </div>
          <div class="flex-columns">
            <div class="font12 color000">版本信息：{{ item.version_number }}</div>
            <div class="log-card">
              <div class="title title-bj">功能优化及更新</div>
              <!--富文本内容-->
              <div class="content"
                   v-html="item.remarks"></div>
            </div>
          </div>
        </el-timeline-item>
        <div v-if="!(journal.length)">

          <ele-empty class="flex-column"
                     style="height: 337px"
                     text="哎呀, 还没有数据~" />
        </div>
      </el-timeline>
    </el-scrollbar>

  </el-card>
</template>
  
<script>
import { getSiteDomainName } from '@/api/siteList/index';
import { isNew, index } from '@/api/version/index';
import { versionList } from '@/api/version/index'
export default {
  name: "log-modal",
  props: {
    visible: Boolean,
    list: Array
  },
  data () {
    return {
      journal: [],
      flag: null,
      is_platform: false,
      loadingUpdata: false,
      logUpdate:
        "<p>1.优化矩阵-D音代用户发布模式下，会发送多条视频的问题。<br />2.优化矩阵-D音代用户发布模式下，标题，话题不正常显示及POI不挂载的问题。<br />3.优化视频发布之后，成片库视频还显示的问题。<br />4.爆客码直推可选择是否授权进行发布。<br />5.去除爆客码中的抖支付。</p>"
    };
  },
  activated () {
    this.querys()

  },
  created () {
    this.queryActivities();
    this.querys()
  },
  methods: {
    async querys () {
      const result = await getSiteDomainName({

      }).catch(() => { });
      console.log(result);
      if (result.code == 0) {
        if (result.data.is_platform == 0) {
          this.is_platform = true
          //主站
          this.isNewFn();

        } else {
          this.is_platform = false
          //   子站

        }
      }


    },
    // 更新版本
    async updata () {
      this.loadingUpdata = true
      const res = await index();
      console.log(res);
      if (res.code == 0) {
        this.loadingUpdata = false
        this.$message.success(res.message)
        this.$router.go(0);
      } else {
        this.loadingUpdata = false
        this.$message.error(res.message)
      }
      // if (res.code == 0) {

      // }
    },
    async isNewFn () {
      const res = await isNew();
      console.log(res);
      if (res.code == 0) {
        this.flag = res.data.flag;
        // if (this.flag) {
        // }
      } else {
        this.$message.error(res.message)
      }
    },
    /* 修改 visible */
    updateVisible (value) {
      this.$emit('update:visible', value);
    },
    onClose () {

    },
    async queryActivities () {
      const res = await versionList({
        page: 1,
        limit: 100000
      })
      if (res.code == 0)
        console.log(res.data)
      this.journal = res.data

    },
  }
}
  </script>
  
  <style lang="scss" scoped>
.line {
  width: 4px;
  height: 25px;
  margin-right: 5px;
  background: rgb(90, 158, 247);
}
.leftStyle {
  position: absolute;
  width: 80px;
  left: -80px;
  top: 1px;
  font-size: 14px;
}
.ele-timeline-act {
  padding-left: 80px;
  :deep(.el-timeline-item__timestamp) {
    margin: 0;
    position: absolute;
    top: 3px;
    left: -45px;
  }

  :deep(.el-timeline-item) {
    padding-bottom: 19px;

    &:last-child {
      padding-bottom: 0;
    }
  }
}
.title {
  color: #3094fe;
  font-weight: bold;
}
.title-bj {
  width: 100%;
  background-color: #f3f3f3;
  padding: 15px 10px;
  font-size: 16px;
}
.log-card {
  margin: 10px 0;
  flex: 1;
  /* box-shadow: 5px 5px 3px 4px rgba(0, 0, 0, .4);  */
  /* box-shadow:水平位置 垂直位置 模糊距离 阴影尺寸（影子大小） 阴影颜色  内/外阴影； */
  box-shadow: 0 15px 30px #f6f6f6;
  border-radius: 10px;
  overflow: hidden;

  .content {
    width: 100%;
    background-color: #fff;
    padding: 10px;
    color: #86919d;
  }
}
</style>
  